<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<c:set var="ctx" value="${pageContext.request.contextPath}" />
<link href="${ctx}/jsp/system/userRoleConfig/userRole.css" rel="stylesheet">
<div class="bjui-pageHeader" style="background:#FFF;">
		<form id="pagerForm" data-toggle="ajaxsearch" action="${ctx}/sys/sysUserRoleAction/toRoleList" method="post">
	        <input type="hidden" name="pageSize" value="${pageResult.pageSize}">
	        <input type="hidden" name="pageCurrent" value="${pageResult.pageCurrent}">
	        <input type="hidden" name="orderField" value="${pageResult.orderField}">
	        <input type="hidden" name="orderDirection" value="${pageResult.orderDirection}">
	        <!-- 刷新按钮-->
			<button class="btn-default" data-icon="refresh">刷新</button>
			<!-- 搜素功能 -->
			<label>角色：<input id="paramName" type="text" name="paramName" value="${pageResult.ext.paramName}" placeholder="模糊搜索"/></label>
			<label>角色描述：<input id="paramDes" type="text" name="paramDes" value="${pageResult.ext.paramDes}" placeholder="模糊搜索"/></label>
		   	<button class="btn-default" data-icon="search">查询</button>
	   	</form>
	</div>
	<!-- 内容区 -->
	<script type="text/javascript">
	/*table row click event*/
	function getContent(e) {
	      var str = 'input[value='+e.id+']';
			$(str).iCheck('check');   
	      }
	/*Radio changed 事件改变监听函数*/
	$('input[name="doc-radio"]').on('ifChanged', function(e) {
        var checked = $(this).is(':checked'), val = $(this).val();
        if (checked){
       /*      $(this).alertmsg('info', '你选择了'+ val); */
            $("#role-id-selected").val(val);
        }
    });
    /*Ajax 保存用户角色设置信息*/
    function setDoSaveUrl(e,roleId,userId){
    	
    	$.post(e.value,{roleId:roleId,userId:userId},function(result){
	    	console.log("success");
           	console.log($(this));
           	  $(this)
	        .bjuiajax('ajaxDone', result)       // 信息提示
	        .navtab('refresh')                // 刷新当前navtab
	        .navtab('reloadFlag', result.tabid)// 为指定的tabid设置刷新标记
	      	.dialog('closeCurrent',result.closeCurrent);
	  	});
    
    }
	</script>
	<div class="bjui-pageContent tableContent">
		
	    <table id="doc-datagrid-table" class="table table-bordered table-hover table-striped table-top">
	     <thead>
	    		<tr style="height:30px;">
		    		<th>选择</th>
		    		<th>角色</th>
		    		<th>角色描述</th>
	    		</tr>
	    	</thead> 
	    	<tbody>
	    	<c:forEach items="${pageResult.list}" var="u">
	    		<tr id="${u.id}" onclick="getContent(this)">
					<td><input id="radio${u.id}" type="radio" name="doc-radio" data-toggle="icheck" value="${u.id}" />
						<script type="text/javascript">
							$("input[name=doc-radio][value=${pageResult.ext.roleId}]").attr("checked",true);
							var v = ${pageResult.ext.roleId};
							 $("#role-id-selected").val(v);
						</script>
					</td>
					<td>${u.name}</td>
					<td>${u.description}</td>
	    		</tr>
	    	</c:forEach>
	    	</tbody> 
	    </table>
	</div>
	<!-- 底部模块[如：工具条、分页组件]  -->
	<div class="bjui-pageFooter role-edit"> 
   		  	<input type="hidden" id="role-id-selected">
			<input type="hidden" id="user-id-selected" value="${pageResult.ext.userId}">
		    <div class="pages">
		    <span>每页 </span>
		    <div class="selectPagesize">
		        <select data-toggle="selectpicker" data-toggle-change="changepagesize">
		            <option value="10">10</option>
		            <option value="30">30</option>
		            <option value="60">60</option>
		            <option value="100">100</option>
		        </select>
		    </div>
		    <span> 条，共 ${pageResult.total} 条</span>
		</div>
		<div class="pagination-box role-edit-pagination-box-padding-right" data-toggle="pagination" data-total="${pageResult.total}" data-page-size="${pageResult.pageSize}" data-page-current="${pageResult.pageCurrent}"></div>

   		<ul class="edit_right_button_group">
   			<li><button type="button" class="btn-close" data-icon="close">关闭</button></li>
        	<li><button type="button" id="doSave" value="${ctx}/sys/sysUserRoleAction/doSave" onclick="setDoSaveUrl(this,$('#role-id-selected').val(),${pageResult.ext.userId})" class="btn btn-default" data-icon="save">保存</button></li>
   		</ul>

</div>